import React from 'react'
import {
    View,
    Text,
    TouchableOpacity,
    Dimensions,
    Image,
}from 'react-native';
import {QRscanner} from 'react-native-qr-scanner';
import BasePage from '../BasePage'
import {Theme, NavigationPage,TeaNavigator, ListRow, NavigationBar, Label, Toast} from 'teaset'
export default class QRScannerViewPage extends BasePage{
    renderNavigationBar(){
        return(
            <NavigationBar
                backgroundColor='#4195D5'
                leftView={ <NavigationBar.BackButton  onPress={() => this.navigator.pop()} />}
            />
        );
    }
    constructor(props) {
        super(props);
        this.state = {
          flashMode: false,
          zoom: 0.2
        };
      }
    renderPage(){
        return (
            <View style={{flex:1, backgroundColor:'white'}}>
                <QRscanner style={{background:'white'}} onRead={this.onRead} renderBottomView={this.bottomView} flashMode={this.state.flashMode} zoom={this.state.zoom} finderY={50}/>
            </View>
        );
    }
    bottomView = ()=>{
        return(
        <View style={{flex:1,flexDirection:'row',backgroundColor:'#0000004D'}}>
          <TouchableOpacity style={{flex:1,alignItems:'center', justifyContent:'center'}} onPress={()=>this.setState({flashMode:!this.state.flashMode})}>
            <Text style={{color:'#fff'}}>点我开启/关闭手电筒</Text>
          </TouchableOpacity>
        </View>
        );
      }
      onRead = (res) => {
        if(res){
            this.navigator.pop()
            Toast.fail('匹配失败')
        }
      }
}